<template>
  <div class="page-wrapper">
    <div class='assemble-page'>
      <!-- <div class="team-tip"><text class="icon-tip">?</text>拼团说明</div> -->
      <div class="goods-item" v-for="(item,index) in assembleList" :key="index">
        <router-link class="assemble-item" :to="'/goods/teamDetail?id=' + item.productSkuId">
          <img class="assemble-item-image" :src="item.picUrl"/>
          <div class="assemble-item-info">
            <div class="assemble-name">{{item.productName}}</div>
            <div class="assemble-bottom">
              <div class="assemble-left">
                <div class="assemble-team-num">{{item.ptSize}}人团</div>
                <div class="assemble-real-fee">
                  <div class="icon">￥</div>
                  {{item.ptPrice}}
                </div>
              </div>
              <div class="assemble-right">
                <div class="assemble-team-btn">
                  {{item.groupBuyStatus === 'INPROGRESS' ? '立刻开团' : '已下架'}}
                </div>
              </div>
            </div>
          </div>
        </router-link>
      </div>
    </div>
  </div>
</template>

<script>
import { API } from '../../config'
export default{
  data(){
    return {
        assembleList: [],
        pageSize: 10,
        pageNum: 1,
        isLoading: false
    }
  },
  methods:{
    initFun() {
        let vm = this
        vm.getTeamList()
    },

    // 团购
    getTeamList(page) {
        let vm = this
        const params = {
            pageNum: page || 1,
            pageSize: vm.pageSize
        }
        vm.$axios.get(API + '/product/selGroupBuy/' + vm.pageNum + '/' + vm.pageSize).then((res) => {
            vm.assembleList = params.pageNum === 1 ? [] : vm.assembleList
            if (res.data.code === 200) {
                vm.assembleList = [...vm.assembleList, ...res.data.data.data]
                if (vm.assembleList.length < vm.pageSize) {
                    vm.loadingShow = 0
                } else if (res.data.data && res.data.data.length === 0) {
                    vm.loadingShow = 2
                } else {
                    vm.loadingShow = 1
                }
            }
        });
    },
    onReachBottom() {
        const vm = this
        if (!vm.isLoading) {
            vm.isLoading = true
            vm.getTeamList(vm.pageNum + 1).then(() => {
                vm.pageNum = vm.pageNum + 1
                vm.isLoading = false
            })
        }
    }
  },

  mounted(options) {
    let vm = this
    vm.initFun()
  }
}
</script>

<style lang='less' scoped>
@import '../../css/common.less';
@import '../../css/assemble/teamList.less';
</style>
